import React,{useRef} from 'react'
import {Form,Input} from "antd";
import api from '../../api'
import './cpt.css'

export default function Competition(){
    const showRef=useRef(null)
    const addRef=useRef(null)
    const modifyRef=useRef(null)
    const delRef=useRef(null)
    const typeRef=useRef(null)
    const {Item}=Form

    async function showCpt(ref,type){
        const Form=ref.current
        let data= {};
        const value=Form.getFieldsValue()
        console.log(value)
        switch (type){
            case 'show':
                data=await api.findCompetitionApi(value);
                break;
            case 'add':
                data=await api.addCompetitionApi(value);
                break;
            case 'modify':
                data=await api.modifyCompetitionApi(value);
                break;
            case 'delete':
                data=await api.deleteCompetitionApi(value);
                break;
            case 'type':
                data=await api.findCptByTypeApi(value);
                break;
            default:
                console.log('未知的类型：',type)
        }
        if(data.status===200){
            console.log('接收到数据拉',data)
        }else {
            console.log('数据出错拉',data)
        }
    }

    return (
        <div>
            <h1 align={'center'}>this is competition</h1>
            <div className={'cpt'}>
                <div className={'show-cpt'}>
                    <Form ref={showRef} onFinish={()=>{showCpt(showRef,'show')}}>
                        <Item name={'id'} rules={[{required:true}]}>
                            <Input placeholder={'比赛id'}/>
                        </Item>
                        <button type={"submit"}>比赛详情</button>
                    </Form>
                </div>
                <div className={'add-cpt'}>
                    <Form onFinish={()=>{showCpt(addRef,'add')}} ref={addRef} action="#">
                        <Item rules={[{required:true}]} name={'title'}>
                            <Input placeholder={'比赛标题'}/>
                        </Item>
                        <Item rules={[{required:true}]} name={'picture'}>
                            <Input placeholder={'图片地址'}/>
                        </Item>
                        <Item rules={[{required:true}]} name={'content'}>
                            <Input placeholder={'比赛内容'}/>
                        </Item>
                        <Item rules={[{required:true}]} name={'type'}>
                            <Input placeholder={'分类'}/>
                        </Item>
                        <Item rules={[{required:true}]} name={'views'}>
                            <Input placeholder={'浏览次数'}/>
                        </Item>
                        <Item rules={[{required:true}]} name={'user'}>
                            <Input placeholder={'发布人'}/>
                        </Item>
                        <Item rules={[{required:true}]} name={'description'}>
                            <Input placeholder={'摘要描述'}/>
                        </Item>
                        <button type={"submit"}>新增比赛</button>
                    </Form>
                </div>
                <div className={'modify-cpt'}>
                    <Form onFinish={()=>{showCpt(modifyRef,'modify')}} ref={modifyRef} action="#">
                        <Item name={'title'} rules={[{required:true}]}>
                            <Input placeholder={'比赛标题'}/>
                        </Item>
                        <Item name={'id'} rules={[{required:true}]}>
                            <Input placeholder={'比赛id'}/>
                        </Item>
                        <Item name={'picture'} rules={[{required:true}]}>
                            <Input placeholder={'图片地址'}/>
                        </Item>
                        <Item name={'content'} rules={[{required:true}]}>
                            <Input placeholder={'比赛内容'}/>
                        </Item>
                        <Item name={'type'} rules={[{required:true}]}>
                            <Input placeholder={'分类'}/>
                        </Item>
                        <Item name={'views'} rules={[{required:true}]}>
                            <Input placeholder={'浏览次数'}/>
                        </Item>
                        <Item name={'user'} rules={[{required:true}]}>
                            <Input placeholder={'发布人'}/>
                        </Item>
                        <Item name={'description'} rules={[{required:true}]}>
                            <Input placeholder={'摘要描述'}/>
                        </Item>
                        <button type={"submit"}>修改比赛</button>
                    </Form>
                </div>
                <div className={'delete-cpt'}>
                    <Form onFinish={()=>{showCpt(delRef,'delete')}} ref={delRef} action="#">
                        <Item name={'id'} rules={[{required:true}]}>
                            <Input placeholder={'比赛id'}/>
                        </Item>
                        <button type={"submit"}>删除比赛</button>
                    </Form>
                </div>
                <div className={'type-cpt'}>
                    <Form onFinish={()=>{showCpt(typeRef,'type')}} ref={typeRef} action="#">
                        <Item rules={[{required:true}]} name={'type'}>
                            <Input placeholder={'比赛类型'}/>
                        </Item>
                        <button type={"submit"}>查找比赛</button>
                    </Form>
                </div>
            </div>

        </div>
    )
}